import { reactive, ref } from 'vue'
import type { MsgData } from '@/types/userInfo'
import type { PageParams } from '@/types/common'
import { getMainPostApi, getComment } from '@/api/user'
import { ImageAddHttp, formatTimestamp } from '@/utils/index'
import { onLoad } from '@dcloudio/uni-app'

export function useScript() {
  const id = ref<number>(0)
  const mainPost = ref<MsgData>()
  const dataList = ref<MsgData[]>([])
  const isLoad = ref(false)
  const refreshEmabled = ref(false)
  const isRefreshing = ref<boolean>(false)
  const pagination = reactive<PageParams>({
    pageSize: 8,
    page: 1,
    total: 0,
    order: 'desc',
  })

  async function getMeg() {
    const params = {
      page: pagination.page,
      limit: pagination.pageSize,
      order: pagination.order,
    }
    isLoad.value = true
    const resultList = await getComment(id.value, params)

    if (resultList.code) {
      // 新添加进 dataList中
      resultList.data.list.forEach((item: any) => {
        dataList.value.push({
          id: item.id,
          user_id: item.user_id,
          avatar: ImageAddHttp(item.avatar),
          nickname: item.nickname,
          username: `@${item.username}`,
          createtime: formatTimestamp(item.createtime, 'yyyy-MM-dd HH:mm:ss'),
          content: item.content,
          is_liked: !!item.is_liked,
          is_collected: !!item.is_collected,
        })
      })
      // 更新总数
      pagination.total = resultList.data.total
      pagination.page = resultList.data.currentPage
      if (!refreshEmabled.value) {
        refreshEmabled.value = true
      }
    }
    isLoad.value = false
    console.log(dataList)
  }

  async function loadMoreComments() {
    if (isLoad.value) return
    if (
      pagination.page !== undefined &&
      pagination.page < Math.ceil((pagination.total ?? 0) / (pagination.pageSize ?? 1))
    ) {
      pagination!.page++
      await getMeg()
    }
  }

  async function refreshComments() {
    if (isLoad.value || isRefreshing.value) return
    isRefreshing.value = true
    dataList.value.length = 0
    pagination.page = 1
    await getMeg()
    isRefreshing.value = false
  }

  async function cardHandle(card: MsgData) {
    uni.navigateTo({
      url: `/pages/message/message?id=${card.id}`,
    })
  }

  async function goBack() {
    uni.redirectTo({
      url: '/pages/profile/profile',
    })
  }

  async function getMainPost(id: number) {
    const result = await getMainPostApi(id)
    if (result.code) {
      mainPost.value = {
        id: result.data.id,
        avatar: ImageAddHttp(result.data.user.avatar),
        nickname: result.data.user.nickname,
        username: `@${result.data.user.username}`,
        createtime: formatTimestamp(result.data.createtime, 'yyyy-MM-dd HH:mm:ss'),
        content: result.data.content,
      }
    }
  }

  async function gotoUserInfo(id: number) {
    uni.navigateTo({
      url: `/pages/profile/profile?id=${id}`,
    })
  }

  async function gotoSelfInfo() {
    uni.navigateTo({
      url: `/pages/profile/profile`,
    })
  }

  onLoad(async (options) => {
    if (options && options.id) {
      id.value = options.id
      await Promise.all([getMainPost(options.id), refreshComments()])
    }
  })

  return {
    mainPost,
    dataList,
    isRefreshing,
    refreshEmabled,
    gotoSelfInfo,
    gotoUserInfo,
    loadMoreComments,
    refreshComments,
    confirm,
    cardHandle,
    goBack,
  }
}
